<template>
  <div class="container">
    <node-panel :topics="topics" :loading="loading"></node-panel>
    <node-page :max="max" :currentPage="currentPage" @update:currentpage="setCurrentPage"></node-page>
  </div>
</template>

<script>
import axios from 'axios'  // 许安装axios插件  npm install --save axios
import nodePanel from './nodePanel'
import nodePage from './nodePage'
export default {
  components: {
    nodePanel, nodePage
  },
  data () {
    return {
      topics: [],
      loading: true,
      max: 10,
      currentPage: 1
    }
  },
  methods: {
    getTopics(page = 1) {
      this.loading = true
      axios.get('https://cnodejs.org/api/v1/topics', {
        params: {
          page,
          limit: 10,
        }
      }).then(res => {
        this.topics = res.data.data
        this.loading = false
      })
    },
    setCurrentPage (page) {
      this.currentPage = page
      this.getTopics(page)
    }
  },
  created () {
    // console.log(this.axios)
    this.getTopics()
  }
}
</script>

<style>

</style>
